/* src/assets/styles/main.css */

/* 定义 rem 的基准字体大小 */
html {
  font-size: 16px; /* 1rem = 16px */
}

body {
  margin: 0;
  padding: 0;
  min-height: 100vh; /* 确保 body 至少占据整个视口高度 */
  overflow-x: hidden; /* 防止水平滚动条 */
  overflow-y: auto;   /* 允许垂直滚动 */
}

a {
  color: #3c8dbc; /* 链接颜色 */
  text-decoration: none; /* 去除下划线 */
}

#app {
  min-height: 100vh;
  display: flex;
  flex-direction: column; /* 垂直堆叠布局 */
  font-family: Avenir, Helvetica, Arial, sans-serif; /* 字体设置 */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50; /* 默认文本颜色 */
  box-sizing: border-box; /* 确保 padding 不会增加元素总尺寸 */
}

/* 全局皮肤样式 (从 style.css 提取) */
.skin-purple .main-sidebar {
  background: #fff; /* 侧边栏背景 */
}

.skin-purple .main-header .logo:hover {
  background: #0abdfe; /* Logo 区域悬停背景 */
}

.skin-purple .main-header .navbar .sidebar-toggle:hover {
  /* background: #0abdfe; */ /* 原始代码中被注释 */
}

.skin-purple .main-header {
  min-height: 4.375rem; /* 70px / 16 = 4.375rem */
  padding: 0;
}

.skin-purple .main-header .logo {
  height: 3.125rem; /* 50px / 16 = 3.125rem */
  float: left; /* 建议在 MainLayout 中使用 flexbox 代替 float */
  padding: 1.25rem 0 0 0.9375rem; /* 20px -> 1.25rem, 15px -> 0.9375rem */
  /* width: 14.375rem; */ /* 230px / 16 = 14.375rem; 如果侧边栏是固定宽度 */
}

.skin-purple .main-header .navbar {
  height: 4.375rem; /* 70px / 16 = 4.375rem */
  background: linear-gradient(to right, #0abdfe, #67f0e0); /* 渐变背景 */
  /* margin-left: 14.375rem; */ /* 230px / 16 = 14.375rem; 这个 margin 最好在 MainLayout 的 flex 布局中处理 */
}

.winfo {
  margin-left: 14.375rem; /* 230px / 16 = 14.375rem; */
}